<style>
    .video_box{
        position: relative;
    }
    .drop-down-video{
        position: absolute;
        top:-12px;
        right: -12px;
        z-index: 99999;
    }
    .drop-down-video i{
        font-size: 24px;
    }
    .material-preview{
        margin-right: 20px !important;
    }
</style>
<div class="layui-tab-item layui-show">
    <div class="openMaterialDraggable" id="Gallery_{$form.field}">
        <?php if(isset($info) && !empty($info) && $info[$form['field']]){;?>
        <?php $images = explode(',',$info[$form['field']]);?>
        {foreach name="$images" item="vo" key="k"}
        <div class="material-preview">
            <div class="" >
                <div class="video_box">
                    <div class="file-item relative" style="height: 150px; width: 200px;">
                        <div class="el-image image">
                            <video src="{$vo}" controls="controls" id="uploadVideo_{$k}" class="el-image__inner"  style="object-fit: contain;">
                                您的浏览器不支持 video 标签。
                            </video>
                        </div>
                    </div>
                    <div class="drop-down-video layui-anim layui-anim-downbit">
                        <i data-val="{$vo}" class="{if $form.type==1} drop-del {else} video-del{/if} layui-icon layui-icon-error"></i>
                    </div>
                </div>
            </div>

        </div>
        {/foreach}
        <input type="hidden" class="drop-value" id="checkGallery_{$form.field}" name="{$form.field}" value="{$info[$form['field']]}"/>
        <input type="hidden" class="drop-value" id="checkDuration_{$form.duration}" name="{$form.duration}" value="{$info[$form['duration']]}"/>
        <?php }?>
    </div>
    <div lay-options="{accept: 'video'}" class="upload-btn {if $form.type==1} uploadGalleryVideo {else} uploadVideoQiNiu {/if}" data-t="2" data-n="{$form.field}" data-types="{$form.type}" data-d="{$form.duration}" data-c="{$form.value}" style="width: 100px; height: 100px;">
        <i class="layui-icon layui-icon-addition" style="font-size: 25px; --color: inherit;"></i>
        <span>添加</span>
    </div>
</div>

<script id="GalleryTemplate2" type="text/html">
    {{# for(var i=0;i< d.data.length ;i++){ }}
    <div class="material-preview">
        <div class="" >
            <div class="video_box">
                <div class="file-item relative" style="height: 150px; width: 200px;">
                    <div class="el-image image">
                        <video src="{{d.data[i]}}" id="uploadVideo_{{i}}" controls="controls" class="el-image__inner" style="object-fit: contain;">
                            您的浏览器不支持 video 标签。
                        </video>
                    </div>
                </div>
                <div class="drop-down-video layui-anim layui-anim-downbit">
                    <i data-val="{{d.data[i]}}" class="layui-icon layui-icon-error {{d.types == 1?'drop-del':'video-del'}}"></i>
                </div>
            </div>
        </div>
    </div>
    {{# } }}
    <input type="hidden" class="drop-value" id="checkGallery_{{d.name}}" name="{{d.name}}" value="{{(d.data).join(',')}}" />
    <input type="hidden" class="drop-value" id="checkDuration_{{d.dname}}" name="{{d.dname}}" value="{{(d.duration).join(',')}}" />
</script>

